import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
// 配置vantui 导入所有组件使用】
import Vant from 'vant';
import 'vant/lib/index.css';
Vue.use(Vant);

// eventBus 事件总线
// 根据js的 发布订阅模式设计的方式
Vue.prototype.$bus=new Vue({})

Vue.config.productionTip = false
// 全局混入
Vue.mixin({
  data(){
    return {
      myhobby:"学习，运动，有爱，诚实"
    }
  },
  methods:{
    eat(){
      console.log("吃烧烤")
    }
  }
})
// vue路由的钩子函数  路由守卫
// 全局钩子函数  
// 全局前置守卫 
// 应用场景： 登录拦截token拦截，是否登录，未登录不能跳转
// 权限拦截： 权限编码不够资格，进行拦截
// 可以根据 to,form中的 path,name,meta,query,parmas等进行拦截
// router.beforeEach((to,from,next)=>{
//   // to ---即将进入的组件
//   console.log("即将进入的组件：",to)
//   if(to.name=="cart"||to.name=="/home"){
//     if(!localStorage.token){
//       next("/about") //next可以传递路径 并跳转
//     }
//   }
//   // from --即将离开的组件
//     console.log("即将离开的组件：",from) 
//     if(from.path=="/about"){
//     }
//   // 继续执行函数 跳转
//   next();
// })

//  全局后置守卫
// 后置守卫 跳转时候拦截 不存在next参数
// router.afterEach((to,from)=>{
//   // to------即将进入的组件
//   // form ----即将离开的组件
// })

// vue路由的钩子函数有哪些?
// 全局函数 全局前置守卫router.beforeEach 全局后置守卫
// router.afterEach
// 组件内部: 进入组件beforeRouteEnter 离开组件beforerRouteLeave 组件路由更新beforeRouteUpdate
// 路由独享的钩子函数 beforeEnter
// 主要形参的有三个 to 即将进入的组件 form 即将离开组件
// next 继续执行函数 next("/login")内部可以传递跳转路径

// 你们项目中路由守卫如何设置？
// 使用router.beforeEach() 我们进行了一些登录拦截，根据用户的token进行拦截 如果未登录，进行next跳转回去登录页


new Vue({
  router,
  store,
  data(){
    return {
      k:"mainjs数据"
    }
  },
  render: h => h(App)
}).$mount('#app')
